<template>
  <div class="orderbox">
    <router-link
      style="padding-bottom:8px;width:14%;text-align:center;"
      v-for="data in datalist"
      :to="data.whatlink"
      active-class="ordercolor"
      :key="data.numb"
      tag="p"
    >{{data.typesoon}}</router-link>
  </div>
</template>
<script>
export default {
  data () {
    return {
      datalist: [
        {
          numb: 0,
          typesoon: '全部',
          whatlink: '/center/myorder/all'
        },
        {
          numb: 1,
          typesoon: '待付款',
          whatlink: '/center/myorder/waitpay'
        },
        {
          numb: 2,
          typesoon: '代发货',
          whatlink: '/center/myorder/deliver'
        },
        {
          numb: 3,
          typesoon: '待收货',
          whatlink: '/center/myorder/harvest'
        },
        {
          numb: 4,
          typesoon: '待评论',
          whatlink: '/center/myorder/comment'
        }
      ]
    }
  }
}
</script>
<style lang="scss" scoped>
.orderbox {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 8px 0 0 0;
  font-size: 14px;
  color: #919191;
}
.ordercolor {
  border-bottom: 2px solid #000000;
  color: #000000;
}
</style>
